body{ overflow-x:hidden; } /* loading start */ #loading { position: fixed; top: 0px; bottom: 0; left: 0; right: 0; z-index: 10000; background-color: #242222; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; align-items: center; } #loading span { width: 100px; height: 100px; border-radius: 50%; border: 10px solid #777777; border-top-color: #fff; position: relative; animation: loadingA 1s linear infinite; } @keyframes loadingA { from {} to { transform: rotate(360deg); } } /* loading end */ /* slideshow */ .slideshow-container { position: relative; height: 400px; width: 100%; overflow: hidden; } .slideshow-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; opacity: 0; transition: opacity 1s ease-in-out; } .slideshow-image.active { opacity: 1; } .slideshow-image.last-active { opacity: 0; } .ui-center { border-radius: 15px; border: solid 2px rgba(128, 128, 128, 0.664); /* offset-x | offset-y | blur-radius | color */ } .box-Text { margin-top: 15px; } .mdui-toolbar { height: 92px; line-height: 56px; } .mdui-typo a::before { display: none; } .pgw-bodg { position: fixed; z-index: -999; width: 100%; height: 100%; background: #00000000; background-attachment: local; background-position: center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; background-repeat: no-repeat; background-image: url(https://img-cdn-cos.lolicon.team/IMAGES/1/2023/03/11/1x640c9526a3570.jpg/wp60); animation: run 60s linear infinite; animation-direction: alternate; } .font-ui { font-weight: 700; font-style: italic; } .home-bodg { position: fixed; z-index: -999; width: 100%; height: 100%; background: #00000000; background-attachment: local; background-position: center; -webkit-background-size: cover; -moz-background-size: cover; background-size: cover; background-repeat: no-repeat; background-image: url(https://img-cdn-cos.lolicon.team/IMAGES/1/2023/03/11/1x640c9526a3570.jpg/wp60); } @keyframes run { from { background-position: 0px; } to { background-position: 100%; } } .mdui-typo-headlineg { margin: 0 0 0.3em 0; font-weight: 400; font-size: 24px; -moz-osx-font-smoothing: grayscale; } .pgw-footer { position: absolute; right: 0; bottom: 0; left: 0; z-index: 1005; backdrop-filter: blur(5px); } html, body { display: flex; flex-flow: column; height: 100vh; font-family: 'Saira', 'Noto Sans SC'; font-weight: normal; font-style: normal; } .load { position: fixed; z-index: -999; width: 100%; height: 100vh; background: #00000000; background-attachment: local; background-position: center; -webkit-background-size: auto; -moz-background-size: auto; background-size: cover; background-repeat: no-repeat; } .main { flex: 1; } .div-height { height: 50px; background-color: rgba(99, 162, 255, 0.664); backdrop-filter: blur(5px); } .pc-introduction { height: 100vh; width: 30%; } .pc-intro-img { height: 100vh; } .middle-section { position: absolute; bottom: 0; height: 30px; /*脚部的高度*/ clear: both; width: 100%; } .y-row { display: flex; width: auto; justify-content: space-between; flex-wrap: nowrap; overflow: scroll; overflow-x: auto; height: 150px; } .bitem { flex: 0 0 80px; padding: 5px } .pc-flex { display: flex; flex-wrap: nowrap; flex-direction: row; justify-content: space-between; height: 100vh; } .pc-flex-item2 { display: flex; flex: 1; flex-wrap: nowrap; justify-content: space-between } .zhe { backdrop-filter: blur(5px); } .mdui-toolbarm, .mdui-toolbarb { backdrop-filter: blur(5px); } .mdui-grid-tile { border-radius: 15px; float: left; width: 25em; margin-left: 15px; position: relative; } .mdui-grid-tile img{ aspect-ratio: 16/9; } @media (max-width: 983px) { .mdui-hidden-lok-down { display: none !important; } } @media (min-width: 982px) { .mdui-hidden-xm-pe { display: none !important; } } .banner { max-width: 1200px; margin-bottom: 15px; box-sizing: border-box; margin-right: auto; margin-left: auto; padding-right: 8px; padding-left: 8px; } @media (min-width: 1383px){ .c-scl{ margin: 0 auto; margin-top: 60px; max-width: 1408px; padding: 0px; } } @media (max-width: 1384px){ .c-scl{ display: none; } } @media (max-width: 1384px){ .c-inner{ display: none; } } @media (min-width: 835px){ .c-secttl{ font-size: 3.75rem!important; padding-bottom: calc(20px - 0.1em); } } .c-secttl{ margin-left: 15px; color: #fffef5; font-size: 10.4vw; font-weight: 700; line-height: 1; padding-bottom: 12px; } @media (min-width: 1383px){ .slow{ text-align: center; margin: 0 auto; margin-top: 61px; margin-left: 15px; max-width: 1408px; border: 2px solid #585858; border-radius: 15px; backdrop-filter: blur(5px); } } @media (max-width: 1384px){ .slow{ display: none; } } @media (min-width: 1383px){ .slow-two{ text-align: center; margin: 0 auto; margin-top: 300px; margin-left: 15px; max-width: 1408px; border: 2px solid #585858; border-radius: 15px; backdrop-filter: blur(5px); } } @media (max-width: 1384px){ .slow{ display: none; } } .slow h2{ padding: 35px 0px 35px 0px; } .slow-two h2{ padding: 35px 0px 35px 0px; }